<script lang="ts" setup>
import { getBannerList } from '../../api/home'
import { onMounted, ref } from 'vue'
import type { Ref } from 'vue'
import { iBanner } from './homeType'

const bannerList: Ref<iBanner[]> = ref([])

onMounted(() => {

    getBannerList().then(res => {
        // console.log(res);
        bannerList.value = res.data.data
    })


})


</script>
<template>
    <div class="box">
        <header class="header">首页</header>
        <div class="content">

            <!-- 轮播图代码 -->
            <van-swipe :autoplay="3000" indicator-color="#f66">
                <van-swipe-item v-for="item in bannerList" :key="item.bannerid">
                    <van-image class="swipe-image" :src="item.img" />
                </van-swipe-item>
            </van-swipe>

        </div>
    </div>
</template>
<style lang="scss" scoped>
.swipe-image {
    width: 100%;
    height: 200px;
}
</style>